<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title>轮胎管理系统 - 修改轮胎信息</title>
    <link href="https://cdn.bootcdn.net/ajax/libs/bootstrap/5.1.3/css/bootstrap.min.css" rel="stylesheet">
    <style>
        .required:after {
            content: " *";
            color: red;
        }
        .card {
            box-shadow: 0 0.125rem 0.25rem rgba(0, 0, 0, 0.075);
        }
        .form-label {
            font-weight: 500;
        }
    </style>
</head>
<body>
<nav class="navbar navbar-expand-lg navbar-dark bg-dark">
    <div class="container">
        <a class="navbar-brand" href="/api/tires">轮胎管理系统</a>
        <button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarNav">
            <span class="navbar-toggler-icon"></span>
        </button>
        <div class="collapse navbar-collapse" id="navbarNav">
            <ul class="navbar-nav me-auto">
                <li class="nav-item">
                    <a class="nav-link" href="/api/tires">轮胎列表</a>
                </li>
                <li class="nav-item">
                    <a class="nav-link" href="/api/tires/batch-add">批量添加轮胎</a>
                </li>
                <li class="nav-item">
                    <a class="nav-link" href="/api/tires/usage">查询使用记录</a>
                </li>
                <li class="nav-item">
                    <a class="nav-link" href="/api/tires/visualization/">轮胎可视化</a>
                </li>
                <li class="nav-item">
                    <a class="nav-link" href="/api/tires/statistics">轮胎统计</a>
                </li>
            </ul>
        </div>
    </div>
</nav>

<div class="container mt-4">
    <div class="d-flex justify-content-between align-items-center mb-4">
        <h1>修改轮胎信息</h1>
        <a href="/api/tires" class="btn btn-secondary">返回列表</a>
    </div>

    <div class="row justify-content-center">
        <div class="col-md-10">
            <div class="card">
                <div class="card-header">
                    <h5 class="mb-0">轮胎信息</h5>
                </div>
                <div class="card-body">
                    <!-- 显示错误信息 -->
                    <div th:if="${error}" class="alert alert-danger" role="alert">
                        <span th:text="${error}"></span>
                    </div>

                    <form th:action="@{/api/tires/{id}/edit(id=${tire.id})}" method="post" class="row g-3">
                        <!-- 隐藏字段用于存储ID -->
                        <input type="hidden" name="id" th:value="${tire.id}" />

                        <div class="col-md-6">
                            <label for="tireNumber" class="form-label required">轮胎号</label>
                            <input type="text" class="form-control" id="tireNumber" name="tireNumber"
                                   th:value="${tire.tireNumber}" required>
                            <div class="form-text">轮胎的唯一识别号</div>
                        </div>

                        <div class="col-md-6">
                            <label for="tireBrand" class="form-label">品牌</label>
                            <input type="text" class="form-control" id="tireBrand" name="tireBrand"
                                   th:value="${tire.tireBrand}">
                        </div>

                        <div class="col-md-6">
                            <label for="tireModel" class="form-label">型号</label>
                            <input type="text" class="form-control" id="tireModel" name="tireModel"
                                   th:value="${tire.tireModel}">
                        </div>

                        <div class="col-md-6">
                            <label for="vehiclePlateNumber" class="form-label">车头车牌号</label>
                            <input type="text" class="form-control" id="vehiclePlateNumber" name="vehiclePlateNumber"
                                   th:value="${tire.vehiclePlateNumber}">
                        </div>

                        <div class="col-md-6">
                            <label for="trailerPlateNumber" class="form-label">挂车车牌号</label>
                            <input type="text" class="form-control" id="trailerPlateNumber" name="trailerPlateNumber"
                                   th:value="${tire.trailerPlateNumber}">
                        </div>

                        <div class="col-md-6">
                            <label for="transportCompany" class="form-label">运输公司</label>
                            <input type="text" class="form-control" id="transportCompany" name="transportCompany"
                                   th:value="${tire.transportCompany}">
                        </div>

                        <div class="col-md-6">
                            <label for="tirePrice" class="form-label">轮胎单价(元)</label>
                            <input type="number" step="0.01" class="form-control" id="tirePrice" name="tirePrice"
                                   th:value="${tire.tirePrice}">
                        </div>

                        <div class="col-md-6">
                            <label for="installCost" class="form-label">装胎费用(元)</label>
                            <input type="number" step="0.01" class="form-control" id="installCost" name="installCost"
                                   th:value="${tire.installCost}">
                        </div>

                        <div class="col-md-6">
                            <label for="installDate" class="form-label">装胎日期</label>
                            <input type="date" class="form-control" id="installDate" name="installDate"
                                   th:value="${tire.installDate != null} ? ${#temporals.format(tire.installDate, 'yyyy-MM-dd')} : ''">
                        </div>

                        <div class="col-md-6">
                            <label for="installMileage" class="form-label">装胎公里数</label>
                            <input type="number" class="form-control" id="installMileage" name="installMileage"
                                   th:value="${tire.installMileage}">
                        </div>

                        <div class="col-12 mt-4">
                            <div class="d-flex justify-content-between">
                                <button type="submit" class="btn btn-success">保存修改</button>
                                <a th:href="@{/api/tires/{id}(id=${tire.id})}" class="btn btn-info">查看详情</a>
                                <a href="/api/tires" class="btn btn-secondary">取消</a>
                            </div>
                        </div>
                    </form>
                </div>
            </div>
        </div>
    </div>
</div>

<footer class="bg-dark text-white mt-5 py-4">
    <div class="container text-center">
        <p class="mb-0">轮胎管理系统 &copy; 2025</p>
    </div>
</footer>

<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/js/bootstrap.bundle.min.js"></script>
</body>
</html>